Flash

A difficult issue to explain to my posters on my message board regards the use of frames. Using Flash to target a certain frame might be simple if you know HTML or how frames work, but 99% of the people using Flash don't spend too much time worrying about HTML. That is where this tutorial comes in. You will learn how to target a frame using Flash. I will even provide you with some necessary HTML training so that you can understand how to target frames using only Flash.

Click the link below to see a sample frames page open in a new window. Notice how the pages load in the right. The links were done in Flash.

Modifying the Frames Page
Being a generous and kind individual, I have provided a frame and sample Flash animation for you to work with during the course of this tutorial. Click here to download the 5K ZIP file containing the necessary files. Once you have downloaded the files, extract them to a folder on your Hard drive. Make sure you keep all the files in one folder so you have easy access; you will be referencing to the files several times in Flash and in HTML.

Understanding Frames
If you do not know what frames are, the example you viewed is a frame. The contents on the left are separated from the contents on the right. While it may seem that I used only one HTML page, there are three HTML files that made the frame work. The link that you use to display the frames, the frameset, and the supporting frames for the links and the content. There are many flavors of frames, and mine was a simple two-column frame.

Here is what you are going to be doing in this tutorial. You are going to link the Flash buttons to Web pages. The Web pages will load in the main, content frame on the right. You will also get to view some HTML that is necessary for the frames to work properly.

Here's How:

1. Launch Notepad or another text-only editor. I will be giving the directions to Notepad in this tutorial. Once Notepad has launched, go to File | Open. From the Files of type drop-down menu, select All Files. Now browse to the folder you have extracted the files from this tutorial. Open the file frameset.

2. Once the file has been opened, you will see HTML code displayed in Notepad. While a lot of it may sound strange to some of you and a 2nd language to others, I will tell you what you need to get out looking at the URL.
    
3. In the middle of your HTML code, notice the tags that say <frame name="contents"... and <frame name="kirupa".

 
[  frame names from the frameset ]
 

4. The frame named "kirupa" is where all the URLs that you link to from Flash should load. The frame named "contents" corresponds to the page containing the Flash button links. You should remember, again, that kirupa is the frame we are targeting! You will need this information when you work in Flash in the next section.

Modifying the Flash Buttons
From the source files you downloaded, I have provided the FLA file for the buttons that are found in the frame. Of course, the buttons do not have any of the links enabled. You will add the getURL statements to the button by following the instructions I provide. For information on using getURL, please visit the following URL: http://www.kirupa.com/developer/flash5/buttonlink.asp

Open the file links.fla in Flash. Once the file has been opened, you will see the three buttons that were used in the sample. Right click on the first button and select Actions. Add a getURL statement by going to Basic Actions | Get URL. Your Actions window should look like this:

Select the line that says getURL. We will start to fill in the information to make the button a real link. In the URL field, enter second.htm. Now, place your mouse cursor in the Window field. You will enter the name of the frame we are going to target....which is kirupa. Enter kirupa in the Window field. Your getURL Action window will look like the following image:

Repeat that step for the remaining two buttons. Instead of using the URL, second.htm, use main.htm and third.htm for the remaining buttons. Copying and pasting the code and modifying just the URL can work out to be much faster than re-entering all of the values. Save the Flash file and Publish it. Open the frameset.htm file in your browser. The links will load in the right frame. This concludes how to make Flash and frames live in harmony.

Just a final word before we wrap up. If you have a question and/or want to be part of a friendly, collaborative community of over 220k other developers like yourself, post on the forums for a quick response!